<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
		<link rel="stylesheet" href="${pageContext.request.contextPath }/statics/css/sapar.css" />
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/statics/css/common.css" />
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/statics/css/group_ticket_list.css" />
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/statics/css/bootstrap.min.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath }/statics/js/jquery.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/statics/js/sapar.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/statics/js/WdatePicker.js"></script>
		<title>客户款统计</title>
	</head>
	<body>
		<div id="saper-container">
			<div id="saper-hd"></div>
			<div id="saper-bd">
				<div class="subfiled clearfix">
					<h2>客户款统计</h2>
				</div>
				<div class="subfiled-content">
					<div class="tab-container" data-trigger="click">
						<!--按钮-->

						<!--<button class="btn btn-primary" data-toggle="modal" data-target="#mymodal">点击按钮触发弹框2</button>-->
						<!-- data-toggle:字面理解是数据切换，意思就是我们要触发什么事件 -->
						<!-- data-target:字面理解是数据目标，意思是我们具体触发哪一个 -->
						<div class="tab">
							<a href="javascript:;" class="current btn btn-primary">收款单查询</a>
							<a href="javascript:;" class="btn btn-primary">应收款查询</a>
							<a href="#mymodal" data-toggle="modal" class="btn btn-primary">填写收款单</a>
						</div>
						<div class="tab-content">
							<div class="tab-content-item">
								<form name="f1" id="f1" action="?m=system&amp;c=myInfo&amp;a=updateInfo&amp;type=1" method="post">
									<div class="search-box clearfix">
										<div class="kv-item clearfix">
											<label>订单编号：</label>
											<div class="kv-item-content">
												<input type="text" placeholder="订单号"/>
											</div>
										</div>
										<div class="kv-item clearfix">
											<label>结算时间：</label>
											<div class="kv-item-content time-select-wrap">
												<div class="time-select">
													<input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" placeholder="开始时间">
													<i class="date-icon"></i>
												</div>
												<span class="line">-</span>
												<div class="time-select">
													<input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" placeholder="结束时间">
													<i class="date-icon"></i>
												</div>
											</div>
										</div>
										<a href="javascript:;" class="sapar-btn sapar-btn-recom query-btn">查询</a>
									</div>
								</form>
								<!--表格开始-->
								<div class="table">
 
									<!--表格具体内容-->
									<div class="table-box">
										<table>
											<thead>
												<tr>
													<td>收款单查询</td>
													<td colspan="3"><input type="text"/></td>
													<td>预览/打印</td>
													<td colspan="3"><input type="text"/></td>
													<td>导出表格</td>
													<td colspan="3"><input type="text"/></td>
												</tr>
												<tr>
													<!--<th>订单号</th>
                                                <th>航班号</th>
                                                <th>起飞时间</th>
                                                <th>行程</th>
                                                <th>人数</th>
                                                <th>总价</th>
                                                <th>操作人</th>
                                                <th>申请时间</th>
                                                <th>操作</th>-->
													<th>序号</th>
													<th>收款单号</th>
													<th>客户名称</th>
													<th>出库类型</th>
													<th>出库单号</th>
													<th>结算方式</th>
													<th>折扣金额</th>
													<th>实收金额</th>
													<th>出库人员</th>
													<th>出库时间</th>
													<th>收款日期</th>
													<th>所属店铺</th>
												</tr>
											</thead>
											<tbody>
												<tr class="no-data">
													<td colspan="12">暂时没有数据</td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr style="background-color: #EFF6FA;">
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
											</tbody>
										</table>
									</div>
								</div>
								<!--表格结束-->
							</div>
							<div class="tab-content-item">
								<form name="f2" id="f2" action="?m=system&amp;c=myInfo&amp;a=updateInfo&amp;type=1" method="post">
									<div class="search-box clearfix">
										<div class="kv-item clearfix">
											<label>订单号：</label>
											<div class="kv-item-content">
												<input type="text" placeholder="订单号">
											</div>
										</div>
										<div class="kv-item clearfix">
											<label>申请时间：</label>
											<div class="kv-item-content time-select-wrap">
												<div class="time-select">
													<input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" placeholder="开始时间">
													<i class="date-icon"></i>
												</div>
												<span class="line">-</span>
												<div class="time-select">
													<input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" placeholder="结束时间">
													<i class="date-icon"></i>
												</div>
											</div>
										</div>
										<a href="javascript:;" class="sapar-btn sapar-btn-recom query-btn">查询</a>
									</div>
								</form>
								<!--表格开始-->
								<div class="table">
									<!--表格具体内容-->
									<div class="table-box">
										<table>
											<thead>
												<tr>
													<th>序号</th>
													<th>客户名称</th>
													<th>出库类型</th>
													<th>出库单号</th>
													<th>实收金额</th>
													<th>折扣金额</th>
													<th>未付金额</th>
													<th>出库人员</th>
													<th>出库时间</th>
													<th>所属店铺</th>
												</tr>
											</thead>
											<tbody>
												<tr class="no-data">
													<td colspan="10">暂时没有数据</td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr style="background-color: #EFF6FA;">
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr style="background-color: rgb(239, 246, 250);">
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr style="background-color: rgb(239, 246, 250);">
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr style="background-color: rgb(239, 246, 250);">
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
												<tr>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
													<td></td>
												</tr>
											</tbody>
										</table>
									</div>
								</div>
								<!--表格结束-->
							</div>
						</div>
					</div>
				</div>
			</div>
			<div id="saper-ft"></div>
		</div>

		<!--弹出的模态框-->
		<div id="mymodal" class="modal fade">
			<!-- modal固定布局，上下左右都是0表示充满全屏，支持移动设备上使用触摸方式进行滚动。。-->
			<div class="modal-dialog modal-dialog">
				<!-- modal-dialog默认相对定位，自适应宽度，大于768px时宽度600，居中-->
				<div class="modal-content">
					<form action="" method="post" enctype="multipart/form-data">
						<!-- modal-content模态框的边框、边距、背景色、阴影效果。-->
						<div class="modal-header">
							<button class="close" data-dismiss="modal">&times;</button>
							<center>
								<h3 class="modal-title">填写收款单</h3></center>
						</div>
						<div class="media-body">
							<div class="addjiejidan">
								<center>
									<table bordercolor="lightgray" border="2">
										<tr align="right">
											<td>客户名称</td>
											<td><input type="text" class="form-control" /></td>
											<td>结算方式</td>
											<td><input type="text" class="form-control" /></td>
										</tr>
										<tr>
											<td>出库单号</td>
											<td><input type="text" class="form-control" /></td>
											<td>出库类型</td>
											<td><input type="text" class="form-control" /></td>
										</tr>
										<tr>
											<td>折扣金额</td>
											<td><input type="text" class="form-control" /></td>
											<td>实收金额</td>
											<td><input type="text" class="form-control" /></td>
										</tr>
										<tr>
											<td>出库时间</td>
											<td><input type="text" class="form-control" /></td>
											<td>出库人员</td>
											<td><input type="text" class="form-control" /></td>
										</tr>
										<tr align="right">
											<td>收款日期</td>
											<td><input type="text" class="form-control" /></td>
											<td>所属店铺</td>
											<td><input type="text" class="form-control" /></td>
										</tr>
										<tr>
											<td>收款缘由</td>
											<td colspan="3"><input type="text" class="form-control" /></td>
										</tr>
									</table>
								</center>
							</div>
						</div>
						<div class="modal-footer">
							<button class="btn btn-default" data-dismiss="modal">关闭</button>
							<button class="btn btn-primary">保存</button>
						</div>
					</form>
				</div>
			</div>

		</div>

	</body>
	<script type="text/javascript" src='${pageContext.request.contextPath }/statics/js/jquery-1.12.4.js'></script>
	<script type="text/javascript" src='${pageContext.request.contextPath }/statics/js/bootstrap.js'></script>
	<script type="text/javascript">
		$('select').iSelect();
		/*		$('.modal').modal();*/
	</script>

</html>